<!--
  * 通知
  *
  * @Author:    syf
  * @Date:      2025-06-03 17:53:30
  * @Copyright  畅想科技
-->
<template>
  <a-drawer
      :title="form.id ? '编辑' : '添加'"
      width="800"
      :open="visibleFlag"
      :footerStyle="{ textAlign: 'right' }"
      @close="onClose"
      :maskClosable="false"
      :destroyOnClose="true"
  >
    <a-form ref="formRef" :model="form" :rules="rules" :label-col="{ span: 5 }" >
                    <a-form-item label="通知标题"  name="noticeTitle">
                      <a-input style="width: 100%" v-model:value="form.noticeTitle" placeholder="通知标题" />
                    </a-form-item>
                    <a-form-item label="通知范围："  name="noticeRange">
                    <a-select  v-model:value="form.noticeRange" optionFilterProp="title" placeholder="请选择角色">
                      <a-select-option v-for="item in schoolList" :key="item.placeId" :title="item.placeName">{{ item.placeName }}</a-select-option>
                    </a-select>
                    </a-form-item>
                    <a-form-item label="通知对象："  name="noticeTo">
                    <a-select  v-model:value="form.noticeTo" optionFilterProp="title" placeholder="请选择角色">
                      <a-select-option v-for="item in typeList" :key="item.typeId" :title="item.typeName">{{ item.typeName }}</a-select-option>
                    </a-select>
                    </a-form-item>
                    <a-form-item label="来源："  name="source">
                      <a-input style="width: 100%" v-model:value="form.source" placeholder="来源" />
                    </a-form-item>
                    <a-form-item label="定时发布">
                      <a-switch
                        v-model:checked="form.scheduledPublishFlag"
                        checked-children="开"
                        un-checked-children="关"
                        @change="changesSheduledPublishFlag"
                      />
                    </a-form-item>
                    <a-form-item v-show="form.scheduledPublishFlag" label="发布时间：">
                      <a-date-picker
                        v-model:value="releaseTime"
                        :format="timeFormat"
                        showTime
                        :allowClear="false"
                        placeholder="请选择发布时间"
                        style="width: 200px"
                        @change="changeTime"
                      />
                    </a-form-item>
                    <a-form-item label="作者："  name="author">
                      <a-input style="width: 100%" v-model:value="form.author" placeholder="作者" />
                    </a-form-item>
                    <a-form-item label="公告内容:" name="contentHtml">
                      <SmartWangeditor ref="contentRef" :modelValue="form.contentHtml" :height="300" />
                    </a-form-item>
    </a-form>

    <template #footer>
      <a-space>
        <a-button @click="onClose">取消</a-button>
        <a-button type="primary" @click="onSubmit">保存</a-button>
      </a-space>
    </template>
  </a-drawer>
</template>
<script setup>
  import { reactive, ref, nextTick } from 'vue';
  import _ from 'lodash';
  import dayjs, { Dayjs } from 'dayjs';
  import { message } from 'ant-design-vue';
  import { SmartLoading } from '/@/components/framework/smart-loading';
  import { tzApi } from '/@/api/business/tz/tz-api';
  import { smartSentry } from '/@/lib/smart-sentry';
  import { rSchoolApi } from '/@/api/support/school-api';
  import SmartWangeditor from '/@/components/framework/wangeditor/index.vue';
  import BooleanSelect from '/@/components/framework/boolean-select/index.vue';

  // ------------------------ 事件 ------------------------

  const emits = defineEmits(['reloadList']);

  // ------------------------ 显示与隐藏 ------------------------
  // 是否显示
  const visibleFlag = ref(false);

  function show(rowData) {
    Object.assign(form, formDefault);
    if (rowData && !_.isEmpty(rowData)) {
      queryAll();
      queryschool();
      Object.assign(form, rowData);
      releaseTime.value =dayjs(form.publishTime);
    }
    visibleFlag.value = true;
    nextTick(() => {
      formRef.value.clearValidate();
    });
  }

  function onClose() {
    Object.assign(form, formDefault);
    visibleFlag.value = false;
  }
 
  // ------------------------ 表单 ------------------------

  // 组件ref
  const formRef = ref();

  const formDefault = {
        id: undefined, //通知序号
        noticeContent: undefined, //通知内容
        noticeTitle: undefined, //通知标题
        noticeRange: undefined, //通知范围：学校编号
        noticeTo: undefined, //通知对象：0:用户，1:接单员，2：商家，3：全体
        source: undefined, //来源
        scheduledPublishFlag: undefined, //是否定时发布
        publishTime: undefined, //发布时间
        author: undefined, //作者
        contentHtml:undefined, //通知内容html
  };
  const typeList = ref([]); //状态列表
  async function queryAll() {
    let res = await tzApi.queryType();
    typeList.value = res.data;
  }
    const schoolList = ref([]); //状态列表
  async function queryschool() {
    let res = await rSchoolApi.querySchoolPage();
    schoolList.value = res.data.list;
  }
  let form = reactive({ ...formDefault });
  const contentRef = ref();


  const rules = {

        scheduledPublishFlag: [{ required: true, message: '是否定时发布 必填' }],
  };
   // ------------------------ 发布时间 ------------------------
  const timeFormat = 'YYYY-MM-DD HH:mm:ss';
  const releaseTime = ref(null);
    function changeTime(date, dateString) {
    form.publishTime = dateString;
  }
  function changesSheduledPublishFlag(checked) {
    releaseTime.value = checked ? dayjs() : null;
    form.publishTime = checked ? dayjs().format(timeFormat) : null;
  }
  // 点击确定，验证表单
  async function onSubmit() {
    try {
      form.contentHtml = contentRef.value.getHtml();
      form.noticeContent = contentRef.value.getText();
      await formRef.value.validateFields();
      save();
    } catch (err) {
      message.error('参数验证错误，请仔细填写表单数据!');
    }
  }

  // 新建、编辑API
  async function save() {
    SmartLoading.show();
    try {
      if (!form.publishTime) {
        form.publishTime = dayjs().format(timeFormat);
      }
      if (form.id) {
        await tzApi.update(form);
      } else {
        await tzApi.add(form);
      }
      message.success('操作成功');
      emits('reloadList');
      onClose();
    } catch (err) {
      smartSentry.captureError(err);
    } finally {
      SmartLoading.hide();
    }
  }

  defineExpose({
    show,
  });
</script>
